<template>
  <view class="start">
    <view @click="pickerShow = true" class="input-view">
        <view>{{dateText}}</view> <image style="width: 50rpx" mode="widthFix" src="https://img-pushpic.doutuimao.net/mini/commonupload/20230517/be90e9842d452cc0797e2145b226e2ae.png" />
    </view>
    <view class="mr-commit" @click="commit" :class="sizeStatus ? 'mr-commit-big' : 'mr-commit-small'"></view> 
    <fui-date-picker minDate="1980-01-01" :show="pickerShow" type="3" @change="change" @cancel="pickerShow = false"></fui-date-picker>
    <LandscapeModel v-model:show="show" :sonFun="sonFun"/>
  </view>
</template>

<script setup lang="ts">
import LandscapeModel from "@/components/Landscape/LandscapeModel.vue";
import { EnumStatus } from "@/utils/constants";
import { flowerDate } from "@/utils/ab";

const sizeStatus = ref(false)
const show = ref(false)
const pickerShow = ref(false)
const emit = defineEmits(['update:defStatus','update:content'])
const dateText = ref()
const dateContent = ref()
const change =(e:any)=>{
  dateText.value = e.result
  dateContent.value = e.day.replace("0","") + "-" + e.month.replace("0","")
  pickerShow.value = false
}

const sonFun = async()=>{
    const data = await flowerDate(dateContent.value)
    console.log(data)
    emit('update:defStatus',EnumStatus.RESULT)
    emit('update:content',data)
}

const startTimer = () => {
    setInterval(() => {
        sizeStatus.value =  !sizeStatus.value
    }, 1000); // 每秒执行一次
  };

  const commit = async ()=>{

    if(!dateText.value){
      uni.showToast({
        title:'请选择生日',
        icon:'none'
    })
      return
    }

    uni.showLoading({
        title: "加载中",
        icon: "none",
    });
    uni.hideLoading()
    show.value = true
}

onMounted(()=>{
      startTimer()
  })
</script>

<style lang="scss" scoped>
.start{
    .input-view {
      width: 60%;
      height: 80rpx;
      left: 19%;
      z-index: 102;
      position: absolute;
      background-image: url("http://img-miniprogram-o.doutuimao.net/miniadmin/programconfig/xcximg/20230726/21e173b2f16081e2e7bec63bdfb03800.png");
      background-size: 100% 100%;
      display: flex;
      align-items: center;
      padding-left: 8rpx;
      top: 65%;
      justify-content: space-between;
      padding: 0 20rpx;
    }

    .mr-commit{
      z-index: 102;
      position: absolute;
      top: 86%;
      width: 60%;
      height: 100rpx;
      left: 20%;
      background-size: 100% 100%;
      display: flex;
      justify-content: center;
      align-items: center;
      color: white;
      background-image: url("http://img-miniprogram-o.doutuimao.net/miniadmin/programconfig/xcximg/20230524/96473fab6fdbb8399b693357351dfaa8.png");
  }
  .mr-commit-big{
      width: 62%;
      height: 105rpx;
      left: 19%;
      transition: all 1s;
  }
  .mr-commit-small{
      width: 60%;
      height: 100rpx;
      left: 20%;
      transition: all 1s;
  }
}

</style>
